<template>
	<view class="mainpadding" v-if="pageShow">
		<!-- 选择生日 -->
		<u-datetime-picker :show="srshow" v-model="value1" :minDate="Number(new Date('1900-01-01'))"
			:maxDate="Number(new Date())" mode="date" @cancel="srcancel" @confirm="srconfirm"></u-datetime-picker>
		<!-- 选择性别 -->
		<u-picker :show="xbshow" :columns="xbcolumns" title="选择性别" @cancel="xbcancel" @confirm="xbconfirm"></u-picker>
		<view class="flexcenter margin_top5" @click="uploadImg(1,avatar,avatar_text)">
			<view class="touxiang flexcenter">
				<image :src="avatar_text" mode=""></image>
				<view class="toubox flexcenter">
					<u-icon name="camera" color="#fff" size="38"></u-icon>
				</view>
			</view>
		</view>
		<view class="">
			<view class="flexbetween margin_top6" @click="jumper('/pages_mypage/xiugainc?name=',nickname)">
				<view class="sanshier xiaohui">昵称</view>
				<view class="flexright">
					<view class="sanshier margin_right1">{{nickname}}</view>
					<u-icon name="arrow-right"></u-icon>
				</view>
			</view>
			<view class="flexbetween margin_top6">
				<view class="sanshier xiaohui">ID号</view>
				<view class="sanshier">{{userinfo.idno}}</view>
			</view>
			<view class="flexbetween margin_top6" @click="jumper('/pages_mypage/xiugaijj?bio=',bio)">
				<view class="sanshier xiaohui">简介</view>
				<view class="flexright">
					<view class="sanshier margin_right1">点击设置</view>
					<u-icon name="arrow-right"></u-icon>
				</view>
			</view>
			<view class="flexbetween margin_top6" @click="xbshow = true">
				<view class="sanshier xiaohui">性别</view>
				<view class="flexright">
					<view class="sanshier margin_right1">{{gender}}</view>
					<u-icon name="arrow-right"></u-icon>
				</view>
			</view>
			<view class="flexbetween margin_top6" @click="srshow = true">
				<view class="sanshier xiaohui">生日</view>
				<view class="flexright">
					<view class="sanshier margin_right1">{{birthday}}</view>
					<u-icon name="arrow-right"></u-icon>
				</view>
			</view>
			<view class="flexbetween margin_top6" @click="srshow = true">
				<view class="sanshier xiaohui">关注是否主页展示</view>
				<u-radio-group v-model="gz_open" placement="row" circle style="flex: 0;">
					<u-radio activeColor="#2361ff" :customStyle="{marginRight: '30rpx'}" label="是" :name="2"></u-radio>
					<u-radio activeColor="#2361ff" label="否" :name="1"></u-radio>
				</u-radio-group>
			</view>
			<view class="flexbetween margin_top6" @click="srshow = true">
				<view class="sanshier xiaohui">粉丝是否主页展示</view>
				<u-radio-group v-model="fs_open" placement="row" circle style="flex: 0;">
					<u-radio activeColor="#2361ff" :customStyle="{marginRight: '30rpx'}" label="是" :name="2"></u-radio>
					<u-radio activeColor="#2361ff" label="否" :name="1"></u-radio>
				</u-radio-group>
			</view>
			<view class="flexbetween margin_top6" @click="jumper('/pages_mypage/xuanzebq','')">
				<view class="sanshier xiaohui">爱好标签</view>
				<view class="flexright">
					<view class="sanshier margin_right1">点击设置</view>
					<u-icon name="arrow-right"></u-icon>
				</view>
			</view>
			<view class="flexbetween margin_top6" @click="flag=1;changeprice=true">
				<view class="sanshier xiaohui">语音通话价格设置</view>
				<view class="flexright">
					<view class="sanshier margin_right1">{{pl_price || 0}}金币</view>
					<u-icon name="arrow-right"></u-icon>
				</view>
			</view>
			<view class="flexbetween margin_top6" @click="flag=2;changeprice=true">
				<view class="sanshier xiaohui">视频通话价格设置</view>
				<view class="flexright">
					<view class="sanshier margin_right1">{{pl_videoprice || 0}}金币</view>
					<u-icon name="arrow-right"></u-icon>
				</view>
			</view>
		</view>
		<yk-authpup ref="authpup" type="top" @changeAuth="changeAuth" :permissionID="permissionID"></yk-authpup>
		<u-picker :show="changeprice" :columns="columns" @cancel="changeprice=false" @confirm="priceconfirm"></u-picker>
	</view>
</template>

<script>
	const httpRequest = require("@/common/httpRequest.js")
	import ykAuthpup from "@/components/yk-authpup/yk-authpup";

	export default {
		components: {
			ykAuthpup
		},
		data() {
			return {
				xbshow: false,
				xbcolumns: [
					['男', '女']
				],
				srshow: false,
				value1: Number(new Date()),
				avatar: "",
				avatar_text: "",
				nickname: "",
				userinfo: {},
				gender: "",
				bio: "",
				birthday: "",
				permissionID: '',
				sourceType: ['camera'],
				pageShow:false,
				changeprice:false,
				columns:[],
				pl_price:"",
				pl_videoprice:"",
				fs_open:1,
				gz_open:1,
				flag:1,//1修改语音价格，2视频
			}
		},
		onLoad() {
			this.userinfomsg()
			this.getprice()
		},
		onShow() {
			uni.$off("editname")
			uni.$on("editname", data => {
				this.nickname = data
			})
		},
		watch:{
			fs_open(val){
				this.setinfo({
					fs_open: this.fs_open
				})
			},
			gz_open(val){
				this.setinfo({
					gz_open: this.gz_open
				})
			}
		},
		methods: {
			getprice(){httpRequest.request('/api/index/getPlPriceItem', 'GET', {}).then(res => {
					let min_pl_price =  Number(res.data.min_pl_price)
					let max_pl_price =  Number(res.data.max_pl_price)
					let arr = []
					for(let i = min_pl_price;i<=max_pl_price;i++){
						arr.push(i)
					}
					this.columns.push(arr)
				})
				
			},
			priceconfirm(e){
				if(this.flag==1){
					this.pl_price = e.value[0]
					this.setinfo({
						pl_price:this.pl_price
					})
				}else{
					this.pl_videoprice = e.value[0]
					this.setinfo({
						pl_videoprice:this.pl_videoprice
					})
				}
				this.changeprice = false
				
			},
			openAuth(permissionID){
				  	  	this.permissionID = permissionID;//这个是对应的权限 ACCESS_FINE_LOCATION 位置权限 / WRITE_EXTERNAL_STORAGE 存储空间/照片权限 / CAMERA相机权限 / CALL_PHONE 拨打电话
				  	  	setTimeout(()=>{
				  	  		this.$refs['authpup'].open();
				  	  	},500)
				  	  },
			uploadImg() {
				let _this = this;
				uni.showActionSheet({
					itemList: ['相机', '相册'],
					success: function(res) {
						if (uni.getSystemInfoSync().brand.toLowerCase() === 'huawei') {
							if(res.tapIndex==0){
								_this.openAuth('CAMERA');
								_this.sourceType=['camera'];
							}else{
								_this.openAuth('WRITE_EXTERNAL_STORAGE');
								_this.sourceType=['album'];
							}
							
						} else {
							if(res.tapIndex==0){
								
								_this.sourceType=['camera'];
							}else{
								
								_this.sourceType=['album'];
							}
							_this.changeAuth();
						}
						
					},
					fail: function(res) {}
				});
			},
			changeAuth(){
				let _this = this;
				// 选择相机走0
				if (this.sourceType=="camera") {
					httpRequest.chooseImage(1, ['camera']).then(res => {
						for (var i = 0; i < res.length; i++) {
							_this.uploadImageService(res[i])
						}
					}).catch(err => {});
				}
				// 选择相册走1
				if (this.sourceType=="album") {
					httpRequest.chooseImage(1, ['album']).then(res => {
						for (var i = 0; i < res.length; i++) {
							_this.uploadImageService(res[i])
						}
					}).catch(err => {});
				}
				
			},
			uploadImageService(url, upImg, upImgs_text) {
				let _this = this;
				httpRequest.uploadFile('/addons/cos/index/upload1', url).then(res => {
					let image_item = res.fullurl;
					this.avatar = res.url;
					this.avatar_text = image_item
					this.setinfo({
						avatar: res.url
					})
				}).catch(err => {});
			},
			userinfomsg() {
				httpRequest.request('/api/user/index', 'GET', {}).then(res => {
					this.userinfo = res.data
					this.avatar = res.data.avatar
					this.avatar_text = res.data.avatar_text
					this.nickname = res.data.nickname
					this.bio = res.data.bio
					this.gender = res.data.gender ? "女" : "男"
					this.birthday = res.data.birthday
					this.pl_price = res.data.pl_price
					this.pl_videoprice = res.data.pl_videoprice
					this.gz_open = res.data.gz_open
					this.fs_open = res.data.fs_open
					
					this.pageShow = true
				})
			},
			// 生日
			srcancel() {
				this.srshow = false
			},
			srconfirm(e) {
				this.srshow = false
				this.birthday = httpRequest.returnDate(e.value)
				this.setinfo({
					birthday: this.birthday
				})
			},
			// 性别
			xbconfirm(e) {
				this.xbshow = false
				if(e.value[0]==this.gender){
					return false
				}
				this.gender = e.value[0]
				this.setinfo({
					gender: this.gender == "男" ? 0 : 1
				})
			},
			setinfo(data) {
				
				httpRequest.request('/api/user/profile', 'GET', data).then(res => {
					console.log("走了奥",res);
					if(res.code!=1){
						httpRequest.toast(res.msg)
						this.userinfomsg()
					}
				})
			},
			xbcancel() {
				this.xbshow = false
			},
			jumper(url, text) {
				uni.navigateTo({
					url: url + text
				})
			},
		}
	}
</script>

<style lang="scss">
	/deep/.u-radio-group {
		flex: none !important;
	}
	.touxiang {
		width: 186rpx;
		height: 186rpx;
		border-radius: 50%;
		position: relative;
		z-index: 100;

		image {
			width: 100%;
			height: 100%;
			border-radius: 50%;
		}
	}

	.toubox {
		position: absolute;
		left: 0;
		top: 0;
		width: 186rpx;
		height: 186rpx;
		background: #000000;
		opacity: .3;
		opacity: 0.5;
		border-radius: 50%;
	}
</style>